<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Component</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Le styles -->
    <link href="../assets/css/bootstrap.css" rel="stylesheet">
    <style type="text/css">
      body {
        padding-top: 60px;
        padding-bottom: 40px;
      }
    </style>
    <link href="http://localhost:8000/static/bootstrap.css" rel="stylesheet">

    <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
      <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    <!-- Le fav and touch icons -->
    <link rel="shortcut icon" href="../assets/ico/favicon.ico">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="../assets/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="../assets/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="../assets/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="../assets/ico/apple-touch-icon-57-precomposed.png">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.js"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
  <script type="text/javascript">
  $().ready(function() {

	    $.validator.addMethod("time", function(value, element) {  
	    return this.optional(element) || /^(([0-1]?[0-9])|([2][0-3])):([0-5]?[0-9])(:([0-5]?[0-9]))?$/i.test(value);  
	    },"Please enter a valid time in the format HH:MM.");

	        $("#input").validate({
	                rules: {
	                        time: "required time",
	                },

	        });

	    });
    
  $(document).ready(function(){
		$('#input').validate();
		});	
  
  

$(document).ready(function(){
$('#sDay').datepicker({
	dateFormat:'yy-mm-dd', minDate:0
	
});
$('#eDay').datepicker({dateFormat:'yy-mm-dd', minDate:0});

});

function dateCheck(){
	var startDate = new Date($('#sDay').val());
	var endDate = new Date ($('#eDay').val());
	var startTime = ($('#StartTime').val());
	var endTime = ($('#EndTime').val());
	var minDate= $(".selector").datepicker("option","minDate");
	var fullDate = new Date()
	$(".selector").datepicker("option","minDate",fullDate);
//	var myDate = new Date();
	
	var twoDigitMonthC = ("0" + (fullDate.getMonth() + 1)).slice(-2)
	var twoDigitMonthS = ("0" + ($('#sDay').datepicker("getDate").getMonth() + 1)).slice(-2)
//	var twoDigitMonth = ((fullDate.getMonth().length+1) === 1)? (fullDate.getMonth()+1) : '0' + (fullDate.getMonth()+1);
//	var currentDate = fullDate.getDate() + "/" + twoDigit + "/" + fullDate.getFullYear();
//	console.log(currentDate); 
	var currentDate = fullDate.getFullYear() + "-" + twoDigitMonthC + "-" +fullDate.getDate() ;
	console.log(currentDate); 
	var sDate = $('#sDay').datepicker("getDate").getFullYear() + "-" + twoDigitMonthS+ "-" +$('#sDay').datepicker("getDate").getDate() ;
	console.log(sDate);
	
	
	

	if ( $('#sDay').datepicker("getDate") > $('#eDay').datepicker("getDate") || sDate< currentDate ){
	    
		$('#dateError').show();
	   
	    return false;
	    
	}
	else
		{
		if (startTime > endTime || startTime == endTime){
			   $('#timeError').show();
			   return false;
			}
		else
			{
			
			$('#dateError').hide();
			$('#timeError').hide();
		return true;
		}
	
}
}



</script>
</head>

 <body>

    <div class="navbar navbar-fixed-top">
      <div class="navbar-inner">
        <div class="container">
          <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </a>
          <ul class="nav">

          <a class="brand" href="/homePage/">Eventati</a>
          <li><a href ="/DashboardHome/">Home Page</a></li>      
          <li > <a href="/AboutUs/">About Us</a></li>
          <li><a href="/ViewInstructions/">Instructions</a></li>
          <li><a href  ="/Terms&Conditions/">  Terms & Conditions</a></li>
         <li><a href  ="/News/">  Latest News and Updates</a></li>
         <li><a href ="/Faqs/"> FAQS</a></li>
         <li><a href ="/Contactus/"> Contactus</a></li>
		<!-- Author: Amina Kadry This form is for logging the user out of his account -->
         <li><a href="/logout/" method="POST">Log out</a></li>
            </ul>
          </div><!--/.nav-collapse -->
        </div>
      </div>
    </div>

    <div class="container">
      <!-- Main hero unit for a primary marketing message or call to action -->
      <div class="hero-unit">
<form  id="input" name="myform" action="/location/" onclick="return dateCheck();" method="POST">
<div align="left"><br>
{% csrf_token %}

<h2>{{template.name}}</h2>
Your Event Name*: <input title="Please enter event name" name="EventName" id="en" name="en" type="text" size="18" value=""  class = "required"/>
<br>


Start Date*:
<input id="sDay" name="sDay" value="" class = "required"/><br>
End Date*:
<input id="eDay" name="eDay" value="" class = "required"/><br>




<div id="dateError" style="display:none;">  Please enter valid dates</font> </div>






<br>
<br>



Start Time*:<input id="StartTime" name="StartTime"  value="00:00" type="time" class = "required"/><br />
End Time*:<input id="EndTime" name="EndTime" input value="01:00" type="time" size="18" class = "required"/><br />
<div id="timeError" style="display:none;">  End time and start time are not valid</font> </div>




<br>
<br>


{% if template.name|stringformat:"s" == "Wedding"  %}
Bride's Name: <input title="Bride's Name" name="BrideName" id="bn" name="bn" type="text" size="18" value="{{template.brideName}}"> (optional)<br />
Groom's Name: <input title="Groom's Name" name="GroomName" id="gn" name="gn" type="text" size="18" value="{{template.groomName}}">(optional)<br />
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>


<h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
<input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda">  Agenda<br>
<input type="checkbox" name="component" value="Media" checked> Media<br>
<input type="checkbox" name="component" value="Social Marketing"> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream" checked> Live Stream<br>
<br>

{% else %}

{% if template.name|stringformat:"s" == "Engagement"  %}
Bride's Name: <input title="Bride's Name" name="BrideName" id="bn" name="bn" type="text" size="18" value="{{template.brideName}}"><br />
Groom's Name: <input title="Groom's Name" name="GroomName" id="gn" name="gn" type="text" size="18" value="{{template.groomName}}"><br />
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

<h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
<input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda">  Agenda<br>
<input type="checkbox" name="component" value="Media" checked> Media<br>
<input type="checkbox" name="component" value="Social Marketing"> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream" checked> Live Stream<br>
<br>
{% else %}


{% if template.name == "Birthday"  %}
 Birthday's Owner: <input title="Birthday's Owner" name="BirthdayOwner" id="bo" name="bo" type="text" size="18" value="{{template.birthdayOwner}}"><br />
 <br>
 <input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>
 
<h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
 <input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda">  Agenda<br>
<input type="checkbox" name="component" value="Media" checked> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream"> Live Stream<br>
<br>
{% else %}

{% if template.name|stringformat:"s" == "Concert"  %}
Singer's Name: <input title="Singer's Name" name="SingerName" id="sn" name="sn" type="text" size="18" value="{{template.singerName}}" ><br />
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>
<h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
  
<input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment" checked> Payment<br>
<input type="checkbox" name="component" value="Agenda" checked> Agenda<br>
<input type="checkbox" name="component" value="Media" checked> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream" checked> Live Stream<br>
<br>

{% else %}


{% if template.name|stringformat:"s" == "Charity"  %}
 Charity Type: <input title="Charity Type" name="CharityType" id="ct" name="ct" type="text" size="18" value="{{template.charityType}}" ><br />
 <input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

  <br>
<h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
 <input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda"> Agenda<br>
<input type="checkbox" name="component" value="Media"> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream"> Live Stream<br>
<br>

{% else %}


{% if template.name|stringformat:"s" == "Conference"  %}
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

  <br>
 <h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
 <input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda" checked> Agenda<br>
<input type="checkbox" name="component" value="Media" checked> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream" checked> Live Stream<br>
<br>

{% else %}


{% if template.name|stringformat:"s" == "Trip"  %}
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

  <br>
 <h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
 <input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment" checked> Payment<br>
<input type="checkbox" name="component" value="Agenda"> Agenda<br>
<input type="checkbox" name="component" value="Media"> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream"> Live Stream<br>
<br>


{% else %}


{% if template.name|stringformat:"s" == "Outing"  %}
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

  <br>
 <h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
 <input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment"> Payment<br>
<input type="checkbox" name="component" value="Agenda"> Agenda<br>
<input type="checkbox" name="component" value="Media"> Media<br>
<input type="checkbox" name="component" value="Social Marketing" checked> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream"> Live Stream<br>
<br>

{% else %}
{% if template.name|stringformat:"s" == "Create your own template"  %}
<input type="checkbox" id="eventStatus" name="eventStatus" value="eventStatus"> Public Event<br>

<b>Description: </b>
<br> 
<textarea name="description" rows="20" cols="40">
</textarea>
 <h3><font color = "BLUE" >Check the components you would like to add to your event:</font></h3>
  <br>
<input type="checkbox" name="component" value="Location" checked> Location<br>
<input type="checkbox" name="component" value="Payment" checked> Payment<br>
<input type="checkbox" name="component" value="Agenda" checked> Agenda<br>
<input type="checkbox" name="component" value="Media"> Media<br>
<input type="checkbox" name="component" value="Social Marketing"> Social Marketing<br>
<input type="checkbox" name="component" value="Live Stream"> Live Stream<br>
<br>
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}
{% endif %}


</div>
<input type="submit" name="name" value="Submit" />
</form>

      </div>   
      </div>

      <hr>

      <footer>
      <p class="pull-center">
		 <a href="/AboutUs/">About Us</a>
				<a href="/ViewInstructions/">Instructions</a>
				<a href  ="/Terms&Conditions/">  Terms & Conditions</a>
				<a href  ="/News/">  Latest News and Updates</a>
				<a href ="/Faqs/"> FAQS</a>
				<a href ="/Contactus/"> Contactus</a>
				<p class="pull-right"><a href="#">Back to top</a></p>

				        <p>&copy; Company 2012</p>      </footer>

    </div> <!-- /container -->

    <!-- Le javascript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="../assets/js/jquery.js"></script>
    <script src="../assets/js/bootstrap-transition.js"></script>
    <script src="../assets/js/bootstrap-alert.js"></script>
    <script src="../assets/js/bootstrap-modal.js"></script>
    <script src="../assets/js/bootstrap-dropdown.js"></script>
    <script src="../assets/js/bootstrap-scrollspy.js"></script>
    <script src="../assets/js/bootstrap-tab.js"></script>
    <script src="../assets/js/bootstrap-tooltip.js"></script>
    <script src="../assets/js/bootstrap-popover.js"></script>
    <script src="../assets/js/bootstrap-button.js"></script>
    <script src="../assets/js/bootstrap-collapse.js"></script>
    <script src="../assets/js/bootstrap-carousel.js"></script>
    <script src="../assets/js/bootstrap-typeahead.js"></script>

  </body>
</html>